<template>
  <view class="plain-card">
    <view class="plain-card-title">
      <view class="plain-card-icon">
        <slot name="icon"></slot>
      </view>
      <text class="plain-card-title">
        <slot name="title"></slot>
      </text>
    </view>
    <view class="plain-card-content">
      <slot name="content"></slot>
    </view>
  </view>
</template>

<script>
export default {};
</script>

<style lang="less">
.plain-card {
  padding: 32rpx;
  background-color: #fff;
  border-radius: 16rpx;

  @icon-size: 62rpx;
  .plain-card-title {
    display: flex;
    align-items: center;

    .plain-card-icon {
      width: @icon-size;
      height: @icon-size;
      margin-right: 8px;
    }

    .plain-card-title {
      font-size: 34rpx;
      color: #000;
    }
  }

  .plain-card-content {
    font-size: 26rpx;
    color: #000;
  }
}
</style>
